<template>
  <div>
    <CloudButton :loading="true">loading</CloudButton>
    <CloudButton :loading="true" type="primary">primary</CloudButton>
    <CloudButton :loading="true" type="dashed">dashed</CloudButton>
     <CloudButton :loading="true" type="danger">danger</CloudButton>
    <CloudButton :loading="true" type="link">link</CloudButton>
    <CloudButton :loading="true" type="cloud">cloud</CloudButton>
    <CloudButton :loading="true" type="ghost">ghost</CloudButton>
  </div>
</template>
<script>
export default {
  title: '8.加载中状态',
  data() {
    return {
      loading: false,
      iconLoading: false,
    };
  },
  methods: {
    enterLoading() {
      this.loading = true;
    },
    enterIconLoading() {
      this.iconLoading = { delay: 1000 };
    },
  },
};
</script>